<template>
  <div class="lm-confirm-info">
    <div class="view-type">
      <div class="title">已选套餐：</div>
      <div class="body">{{ confData.tacoType }}</div>
    </div>
    <div class="view-type">
      <div class="title">已选矫治器：</div>
      <div class="body">{{ confData.jzqType }}</div>
    </div>
    <div class="view-type">
      <div class="title">寄送地址：</div>
      <div class="body">{{ confData.dizhi }}</div>
    </div>
    <div class="view-fenxian">
      <div class="title">风险提示</div>
      <div class="subtitle">请确认已经了解罗慕分析报告内容，并仔细阅读风险提示！</div>
      <div class="body">
        1、罗慕技术中心提供的辅助诊断报告结果是根据您提供的有限资料进行分析，而得出的有限的参考性治疗方案，请您知悉。
        <br />
        2、您已阅读罗慕技术中心提供的辅助诊断报告，并已知悉参考性治疗方案和相关风险。
        <br />
        3、最终的医嘱治疗方案由您根据罗慕技术中心的辅助诊断报告，并结合您的临床经验和患者的具体诊疗情况综合分析制定，相关风险请自行把控。
        <br />
        4、您需要督促家长让患儿按医嘱佩戴罗慕矫治器，以达到最好的治疗效果。如患儿不予配合佩戴，会影响罗慕治疗效果，其不利结果罗慕技术中心无法承担。
        <div class="bottom">点击确认后请等待罗慕中心制作矫治器。</div>
        <el-checkbox v-model="checked">勾选表示以了解以上风险内容</el-checkbox>
      </div>
    </div>
    <div class="result-ststus">
      <div class="title">审核结果</div>
      <div class="redio">
        <el-radio v-model="radio" label="1">通过</el-radio>
        <el-radio v-model="radio" label="2">未通过</el-radio>
      </div>
      <el-input
        v-model="textarea"
        type="textarea"
        :rows="3"
        placeholder="请填写未通过原因"
      >
      </el-input>
    </div>
  </div>
</template>
<script>
export default {
  props: {
    plan: {
      type: Object,
      default: () => {}
    }
  },
  data() {
    return {
      checked: '',
      radio: '',
      textarea: '',
      confData: {
        tacoType: 'All-in-1套餐',
        jzqType: '隐形矫治器',
        dizhi: '北京市朝阳区望花路与花家地街交叉路口'
      }
    };
  },
  methods: {
    changeType(type) {
      this.plan.plan = type;
    }
  }
};
</script>
<style lang="scss" scoped>
.lm-confirm-info{
  .view-type{
    width: 90%;
    height: 80px;
    background: #FFFFFF;
    border: 1px solid #A0BAE1;
    border-left:#508FCC 6px solid;
    opacity: 1;
    border-radius: 6px;
    padding-left:36px;
    margin-bottom:32px;
    .title{
      height: 21px;
      font-size: 14px;
      font-family: Microsoft YaHei;
      font-weight: 400;
      line-height: 26px;
      color: #333333;
      opacity: 1;
      margin: 16px 0 10px 0 ;
    }
    .body{
      height: 21px;
      font-size: 14px;
      font-family: Microsoft YaHei;
      font-weight: bold;
      line-height: 21px;
      color: #666666;
      opacity: 1;
    }
  }
  .view-fenxian{
    width: 90%;
    background: #F8F8FA;
    opacity: 1;
    border-radius: 6px;
    padding: 16px;
    .title{
      font-size: 16px;
      font-family: Microsoft YaHei;
      font-weight: bold;
      line-height: 26px;
      color: #333333;
    }
    .subtitle{
      font-size: 14px;
      font-family: Microsoft YaHei;
      font-weight: bold;
      line-height: 26px;
      color: #333333;
    }
    .body{
      font-size: 14px;
      font-family: Microsoft YaHei;
      font-weight: 400;
      line-height: 30px;
      color: #666;
      opacity: 1;
      .bottom{
         color: #508FCC;
      }
    }
  }
  .result-ststus{
    margin-top:32px;
    margin-bottom:32px;
    width: 90%;
    .title{
      font-size: 16px;
      font-family: Microsoft YaHei;
      font-weight: bold;
      line-height: 26px;
      color: #333333;
      opacity: 1;
    }
    .redio{
      font-size: 14px;
      font-family: Microsoft YaHei;
      font-weight: 400;
      line-height: 22px;
      color: #666666;
      padding: 16px 0 13px 0;
    }
  }
}
</style>
